@charset "UTF-8";

html,body {
    margin:0px;
    padding: 0px;
}
.contain {
    width: 100%;
}
.wrapper {
    width: 800px;
    margin: 40px auto;
}

/* 默认样式按钮 */
.layui-btn {
    display: inline-block;
    padding: 0 28px;
    height: 38px;
    line-height: 38px;
    background-color: #009688;
    color: #ffffff;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    box-sizing: border-box;
    transition: all 0.3s;
    outline: none;
    vertical-align: middle;
}
.layui-btn:hover {
    opacity: 0.8;
    color: #ffffff;
}

    /* 原始样式 */
.layui-btn-primary {
    border: 1px solid #c9c9c9;
    background-color: #ffffff;
    color: #555555;
}
.layui-btn-primary:hover {
    color: #333333;
    border-color: #009688;
}

/* 百搭样式 */
.layui-btn-normal {
    background-color: #1e9fff;
}

/* 暖色样式 */
.layui-btn-warm {
    background-color: #ffb800;
}

/* 警告样式 */
.layui-btn-danger {
    background-color: #ff5722;
}

/* 禁用样式 */
.layui-btn-disable {
    border: 1px solid #e6e6e6;
    color: #c9c9c9;
    cursor: not-allowed;
    opacity: 1;
    background-color: #fbfbfb;
}
.layui-btn-disable:hover {
    border: 1px solid #e6e6e6;
    background-color: #fbfbfb;
    cursor: not-allowed;
    color: #c9c9c9;
    opacity: 1;
}

/* 尺寸大小样式 */
.layui-btn-lg {
    height: 44px;
    line-height: 44px;
    padding: 0 25px;
    font-size: 16px;
}
.layui-btn-sm {
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    font-size: 12px;
}
.layui-btn-xs {
    height: 22px;
    line-height: 22px;
    padding: 0 5px;
    font-size: 12px;
}
